<template>
	<view>
		<view style="height: 160rpx;box-sizing:border-box; padding-top: 81rpx;border-bottom: 2rpx solid #F7F7F7;">
			<image src="/static/shequ/fh.png" @click="backTo()" style="margin: 0 259rpx 0 30rpx; width: 18rpx;height: 32rpx;" mode="aspectFit"></image>
			<text style="font-size: 32rpx;">浏览历史</text>
		</view>
		<scroll-view :scroll-y="true">
			<view
				style="margin:30rpx 27rpx 25rpx 25rpx; display: flex;flex-wrap: nowrap;box-sizing: border-box; width: 698rpx;height: 252rpx;padding: 20rpx 0 18rpx 20rpx; box-shadow: 0 0 10rpx 5rpx #f1f1f1;border-radius: 14rpx;"
				v-for="(item, index) in 4"
				:key="index"
			>
				<image src="" style="background-color: #766E62; width: 206rpx;height: 206rpx;border-radius: 14rpx;" mode="aspectFill"></image>
				<view style="margin-left: 18rpx;">
					<text class="title">藤椒抄手藤椒抄手藤椒抄手藤椒抄手藤椒抄手</text>
					<view style="display: flex;align-items: center;margin-top: 10rpx; flex-wrap: nowrap;font-size: 22rpx;color: #FF6F00;">
						<text style="margin-right: 5rpx;">4.9</text>
						<uni-rate @change="onChange" v-model="value" :value="5" :size="12" color="#ADC3D0" activeColor="#FF6F00"></uni-rate>
						<text style="color: #666666;font-size: 22rpx;margin-left: 158rpx;">月售1589</text>
					</view>
					<view style="font-size: 22rpx;color: #666666;margin-top: 5rpx;">
						<text>起送¥20</text>
						<text style="margin: 0 70rpx 21rpx 10rpx;">免配送费</text>
						<text>37分钟</text>
						<text style="margin-left: 20rpx;">3.2km</text>
					</view>
					<view
						style="width: 301rpx;margin-top: 10rpx; height: 38rpx;border: 1rpx solid #B4B4B4;border-radius: 8rpx;line-height: 38rpx;padding: 1rpx 4rpx; font-size: 20rpx;color: #1B1B1B;"
					>
						<text>新品发布</text>
						<text style="margin-left: 6rpx;margin-right: 6rpx;">支持自取</text>
						<text>热卖推荐</text>
					</view>
					<view style="font-size: 20rpx;color: #1B1B1B;margin-top: 12rpx;">
						<text style="padding: 1rpx 4rpx;border: 1rpx solid #B4B4B4;border-radius: 8rpx;margin-right: 13rpx;">22减10 48减20</text>
						<text style="padding: 1rpx 4rpx;border: 1rpx solid #B4B4B4;border-radius: 8rpx;">新品发布</text>
					</view>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			value:5
		};
	},
	methods: {
	}
};
</script>

<style lang="scss">
.title {
	width: 388rpx;
	font-size: 30rpx;
	font-weight: bold;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	overflow: hidden;
	margin-top: -10rpx;
}
</style>
